<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="../jquery-1.8.3.min.js"></script>
</head>
<body>
    <h1>JQ AJAX</h1>
    <button id="btn">加载</button>
    <hr>
    <div id="box"></div>

    <script>
        $('#btn').click(function(){
            // $.get('../php/4.php',function(data){
            //     console.log(data);
            //     $('#box').html(data);
            // },'json');
            // 
            // ajax方式 店长推荐
            $.ajax({
                url: '../php/4.php',
                type: 'post',
                dataType:'json',
                success : function (data){
                    console.log(data);
                    for (var i = 0; i < data.length; i++) {
                        $('<li>').html(data[i].name).appendTo('#box');
                    }
                },
                error: function(){
                    alert('执行失败');
                }
            });
        });
    </script>
</body>
</html>